@keyframes rotateone {  
    form {
        transform:rotate(0deg);
        -webkit-transform:rotate(0deg);
    }
    to { 
        transform: rotate(360deg); 
        -webkit-transform: rotate(360deg); 
    }
}
@-webkit-keyframes rotateone {  
    form {
        transform:rotate(0deg);
        -webkit-transform:rotate(0deg);
    }
    to { 
        transform: rotate(360deg); 
        -webkit-transform: rotate(360deg); 
    }
}

@keyframes pao {
    0% {
        transform: translate(0,9vw) rotate(360deg) scale(.4,.4);
        opacity: .13;
    }
    50% {
        transform: translate(10%,-15vw) rotate(360deg) scale(.8,.8);
        opacity: .2;
    }
    100% {
        transform: translate(20%,-35vw) rotate(360deg) scale(1,1);
        opacity: 0;
    }
}
@keyframes pao2 {
    0% {
        transform: translate(-30%,7vw) rotate(360deg) scale(1,1);
        opacity: .13;
    }
    50% {
        transform: translate(20%,-12vw) rotate(360deg) scale(.8,.8);
        opacity: .2;
    }
    100% {
        transform: translate(70%,-16vw) rotate(360deg) scale(.4,.4);
        opacity: 0;
    }
}
@keyframes pao3 {
    0% {
        transform: translate(0%,7vw) rotate(360deg) scale(1,1);
        opacity: .13;
    }

    50% {
        transform: translate(-20%,-15vw) rotate(360deg) scale(.8,.8);
        opacity: .2;
    }
    100% {
        transform: translate(-60%,-7vw) rotate(360deg) scale(.4,.4);
        opacity: 0;
    }
}

@keyframes Ball2 {
    0% {
        transform: translate(0 , 0) rotate(0) scale(1,1);
    }
    25% {
        transform: translate(-3vw, -3vw);
    }
    50% {
        transform: rotate(360deg) scale(.9,.9);
    }
    75% {
        transform: translate(3vw , 5vw);
    }
    100% {
        transform: translate(0 , 0)  rotate(0) scale(1,1);
    }
}

.B2 .ball_3,.B1 .ball_2{
    -webkit-animation: Ball2 12s infinite; 
    -moz-animation: Ball2 12s infinite; 
    -ms-animation: Ball2 12s infinite; 
    -o-animation: Ball2 12s infinite; 
    animation: Ball2 12s infinite;
}

@keyframes Ball4 {
    0% {
        transform: translate(0 , 0) scale(1,1);
        opacity: .13;
    }
    50% {
        transform: translate(-1vw, -1vw) scale(.95,1.05);
        opacity: .2;
    }
    100% {
        transform: translate(0 , 0) scale(1,1);
        opacity: .13;
    }
}
.B2 .ball_4{
    -webkit-animation: Ball4 6s infinite; 
    -moz-animation: Ball4 6s infinite; 
    -ms-animation: Ball4 6s infinite; 
    -o-animation: Ball4 6s infinite; 
    animation: Ball4 6s infinite;
}

@keyframes Ball3 {
    0% {
        transform: translate(0 , 0) rotate(0) scale(1,1);
    }
    50% {
        transform: translate(-1vw, -1vw) rotate(5deg) scale(.9,1.1);
    }
    100% {
        transform: translate(0 , 0)  rotate(0) scale(1,1);
    }
}
.B3 .ball_2{
    -webkit-animation: Ball3 4s infinite; 
    -moz-animation: Ball3 4s infinite; 
    -ms-animation: Ball3 4s infinite; 
    -o-animation: Ball3 4s infinite; 
    animation: Ball3 4s infinite;
}
@keyframes Ball31 {
    0% {
        transform: translate(0 , 0) ;
    }
    50% {
        transform: translate(0, -1.5vw) ;
    }
    100% {
        transform: translate(0 , 0) ;
    }
}
.B3 .ball_1{
    -webkit-animation: Ball31 4s infinite; 
    -moz-animation: Ball31 4s infinite; 
    -ms-animation: Ball31 4s infinite; 
    -o-animation: Ball31 4s infinite; 
    animation: Ball31 4s infinite;
}

@keyframes Ball11 {
    0% {
        transform: scale(1,1);
    }
    50% {
        transform: scale(.9,.9);
    }
    100% {
        transform: scale(1,1) ;
    }
}
.B1 .ball_1{
    -webkit-animation: Ball11 4s infinite; 
    -moz-animation: Ball11 4s infinite; 
    -ms-animation: Ball11 4s infinite; 
    -o-animation: Ball11 4s infinite; 
    animation: Ball11 4s infinite;
}

@keyframes beat { 
  0%, 100% {
    transform: scale(1, 1);
  }
  25% {
    transform: scale(0.9, 1.1);
  }
  50% {
    transform: scale(1.1, 0.9);
  }
  75% {
    transform: scale(0.95, 1.05);
  }
}
@keyframes cirle1 {
    0% {
        transform: translate(0,-1.5vw) rotate(360deg) scale(1,1);
    }
    50% {
        transform: translate(5%,0vw) rotate(360deg) scale(.95,.95);
    }
    100% {
        transform: translate(0,-1.5vw) rotate(360deg) scale(1,1);
    }
}
@keyframes cirle2 {
    0% {
        transform: translate(0,-0.5vw) rotate(360deg) scale(1,1);
    }
    50% {
        transform: translate(-5%,0vw) rotate(360deg) scale(.9,.9);
    }
    100% {
        transform: translate(0,-0.5vw) rotate(360deg) scale(1,1);
    }
}
@keyframes cirle3 {
    0% {
        transform: translate(0,-0.5vw) rotate(360deg) scale(1,1);
    }
    50% {
        transform: translate(0,0vw) rotate(360deg) scale(.9,.9);
    }
    100% {
        transform: translate(0,-0.5vw) rotate(360deg) scale(1,1);
    }
}
@keyframes cirle4 {
    0% {
        transform: translate(0,0) rotate(360deg) scale(1,1);
    }
    50% {
        transform: translate(5%,0.5vw) rotate(360deg) scale(.95,.95);
    }
    100% {
        transform: translate(0,0) rotate(360deg) scale(1,1);
    }
}
.B4 .cirle1{    
    -webkit-animation: cirle1 5s infinite; 
    -moz-animation: cirle1 5s infinite; 
    -ms-animation: cirle1 5s infinite; 
    -o-animation: cirle1 5s infinite; 
    animation: cirle1 5s infinite;}

.B4 .cirle2{    
    -webkit-animation: cirle2 5s infinite; 
    -moz-animation: cirle2 5s infinite; 
    -ms-animation: cirle2 5s infinite; 
    -o-animation: cirle2 5s infinite; 
    animation: cirle2 5s infinite;}
.B4 .cirle3{    
    -webkit-animation: cirle3 4s infinite; 
    -moz-animation: cirle3 4s infinite; 
    -ms-animation: cirle3 4s infinite; 
    -o-animation: cirle3 4s infinite; 
    animation: cirle3 4s infinite;}
.B4 .cirle4{    
    -webkit-animation: cirle4 6s infinite; 
    -moz-animation: cirle4 6s infinite; 
    -ms-animation: cirle4 6s infinite; 
    -o-animation: cirle4 6s infinite; 
    animation: cirle4 6s infinite;}

@keyframes tcirle4 {
    0% {
        transform: translate(0,0) rotate(30deg) ;
    }
    50% {
        transform: translate(0,0) rotate(0deg) ;
    }
    100% {
        transform: translate(0,0) rotate(30deg);
    }
}
    .plogo .icon{
    -webkit-animation: tcirle4 6s infinite; 
    -moz-animation: tcirle4 6s infinite; 
    -ms-animation: tcirle4 6s infinite; 
    -o-animation: tcirle4 6s infinite; 
    animation: tcirle4 6s infinite;}
